<template>
	<view class="head w-[100%]"><image src="https://guangxins.oss-cn-shenzhen.aliyuncs.com/images/bg/buybg.jpg" mode="widthFix" style="width:100%;"></image></view>
	<!-- 文章 -->
	<!-- <view class="articles relative z-0 flex flex-col">
		<view class="flex justify-between relative z-10 left-3 -top-[88rpx]">
			<view class="tagtitle mid" :class="curIndex===0?'':'nobg'" @click="selectThis(0)">健康专栏</view>
			<view class="tagtitle mid relative -left-8" :class="curIndex===1?'':'nobg'" @click="selectThis(1)">视频回放</view>
			<view class="relative right-6 top-3 small">更多></view>
		</view>
		<view class="flex flex-col relative -top-[60rpx]" v-if="curIndex===0">
			<view class="flex justify-between my-2" v-for="(item,index) in articlesList.data" @click="goDetail(item)">
				<text class="small">{{index+1}}、{{strLen(item.atitle)}}</text>
				<text class="small">{{ formatTime(item.createtime)}}</text>
			</view>
		</view>
		<view class="flex flex-col relative -top-[60rpx]" v-if="curIndex===1">
			<view class="flex justify-center my-2 relative -top-[30rpx] w-[100%] h-[100%] videoPlay" v-for="(item,index) in videosList.data">
				<video ref="myVideo" id="myVideo" :src="item.acontent" objectFit="contain" :poster="item.afacephoto" controls :style="'margin:0 auto; Width:'+winWidth+'px; max-height:'+winHeight+'px;'"></video>
			</view>
		</view>
	</view> -->
	<view class="flex justify-center w-[100%] flex-row flex-wrap margin:0 auto; contain">
		<view class="flex justify-start w-[47%] mt-3" @click="gourl('/pages/buy/buy',-1)"><image class="imgwidth" src="https://guangxins.oss-cn-shenzhen.aliyuncs.com/images/home/buycourse.png" mode="widthFix"></image></view>
		<view class="flex justify-end w-[47%] mt-3" @click="gourl('/pages/cepingbuy/cepingbuy',-1)"><image class="imgwidth" src="https://guangxins.oss-cn-shenzhen.aliyuncs.com/images/home/byrecord.png" mode="widthFix"></image></view>
		<view class="flex justify-center w-[48%] mt-3" @click="gourl('/pages/zhidao/zhidao',-1)"><image src="https://guangxins.oss-cn-shenzhen.aliyuncs.com/images/home/card4.png" mode="widthFix"></image></view>
		<view class="flex justify-center w-[48%] mt-3" @click="gourl('/pages/mine/mine',2)"><image src="https://guangxins.oss-cn-shenzhen.aliyuncs.com/images/home/card1.png" mode="widthFix"></image></view>
		<view class="flex justify-center w-[48%] mt-3" @click="gourl('/pages/binduser/binduser',-1)"><image src="https://guangxins.oss-cn-shenzhen.aliyuncs.com/images/home/card2.png" mode="widthFix"></image></view>
		<view class="flex justify-center w-[48%] mt-3" @click="gourl('/pages/openPDF/openPDF',2)"><image src="https://guangxins.oss-cn-shenzhen.aliyuncs.com/images/home/card3.png" mode="widthFix"></image></view>
	</view>
</template>

<script setup lang='ts'>
import { ref,reactive } from 'vue'
import {  onLoad,onShow,onShareAppMessage,onShareTimeline } from '@dcloudio/uni-app'
import {ChineseDate} from '@/common/date.js'
import { userStore } from '@/stores/userStore'
let { hasLogin,userData } = userStore();


let winWidth=ref(uni.$tools.GetScreenWidth());
let winHeight=ref(190);
const videoPlayUrl=ref(""); //https://qiniu-web-assets.dcloud.net.cn/unidoc/zh/2minute-demo.mp4

//文章列表
let articlesList=reactive({data:[]});
//视频列表
let videosList=reactive({data:[]});

let curIndex=ref(0);


//检查登录
const checkLogin=(url:string)=>{
	let msg="请登录后操作";
	if(hasLogin===false || userData.userinfo===null){
		if(url.indexOf("buy")!=-1){
			msg="请登录后购买，点击【确定】继续";
			uni.showModal({
					title:"温馨提示",
					content:msg,
					showCancel:true
			})
			return false;
		}
		return true;
	}
	return true;
}

const goDetail=(item:any)=>{
	uni.setStorageSync("articleDetail",item);
	gourl('/pages/article/article',-1)
}

const selectThis=(index:number)=>{
	curIndex.value=index;
}

const gourl=(url:string,num:number)=>{
	
	if(num<0){
		uni.$tools.GoUrl(url);
	}else{
		uni.$tools.GoUrl(url,num);
	}	
}

const updateLoginTime=()=>{
	// if(userData.userinfo.id===null || userData.userinfo.id===undefined){
	// 	uni.$tools.Toast("未登陆");
	// 	setTimeout(()=>{
	// 		uni.$tools.GoUrl('/pages/login/login',0);
	// 	},1000);
	// 	return;
	// }
	 if(userData.userinfo.id!=null || userData.userinfo.id!=''){
		let paraData={
			id:userData.userinfo.id
		}
		console.log("更新时间参数:",paraData);
		uni.$tools.Reqeust('/api/updateLoginTime',paraData,'POST').then((res:any)=>{
			console.log(res);
			if(res.data.code===200){
				getArticlesAndVideos(); //读取文章和视频
			}
		});	
	}
}


/*获取文章和视频*/
const getArticlesAndVideos=()=>{
	let paraData={}
	console.log("获取文章和视频参数:",paraData);
	uni.$tools.Reqeust('/api/getArticlesAndVideos',paraData,'POST').then((res:any)=>{
		console.log(res);
		if(res.data.code===200){
			if(res.data.articlesData!=null){
				articlesList.data=[];
				videosList.data=[];
				res.data.articlesData.forEach(item=>{
					if(item.atype==='视频'){
						videosList.data.push(item);
					}else{
						articlesList.data.push(item);
					}
				});
				console.log("文章列表",articlesList.data);
				console.log("视频列表",videosList.data);
			}
		}
	});	
}



const strLen=(inputstring:string)=>{
	if(inputstring.length>=18) return inputstring.substring(0,15)+"..";
	return inputstring;
}
const formatTime=(inputstring:string)=>{
	//console.log("112233",ChineseDate(inputstring.split(" ")[0]))
	return inputstring.indexOf(" ")!=-1?ChineseDate(inputstring.split(" ")[0]):inputstring;
}

onShow(()=>{
	updateLoginTime();//更新用户登录时间
	console.log("宽度:",winWidth.value);
	if(winWidth.value<380) winHeight.value=170;
	if(winWidth.value>414) winHeight.value=200;
});




onShareAppMessage(()=>{
       return {
		   title: '广心智康云愈心理', //分享的名称
		   path: '/pages/index/index',//分享详情页面时，需要把所需参数代入
		   mpId: 'wxb73b250f36ad01d2', //此处配置微信小程序的AppId
	   };
});

onShareTimeline(()=>{
       return {
		   title: '广心智康云愈心理', //分享的名称
		   type:0,
		   summary:'广心智康云愈心理',
	   };
})

</script>
<style>
	page{
		background:#f6eade;
		padding-bottom:200rpx;
	}
</style>
<style lang='scss' scoped>
	@import "index.scss";
</style>